var faderdelay='5000'; //delay between msg scrolls. 3000=3 seconds.
var faderunning = 0;
var blendDone=true;
var theSlide=0;
var imgWidth=176;
var imgHeight=110;
var slides=new Array();
// images must be in /includes/site_images/branding
slides[slides.length]=["banner_smiling_girl.png","Smiling girl"];
slides[slides.length]=["banner_boy_in_playground.png","Boy in playground"];
slides[slides.length]=["banner_father_son.png","Father and son"];
slides[slides.length]=["banner_mother_daughter.png","Mother and daughter"];
slides[slides.length]=["banner_senior_biking.png","Senior biking"];
slides[slides.length]=["banner_senior_couple.png","Senior couple"];

theSlide=Math.floor(Math.random()*slides.length);

function fade(){
	if (!blendDone){
		setTimeout("fade()",1);
	}else{
		setTimeout("fade()",faderdelay);
		if (theSlide==slides.length-1){
			theSlide=0;
		}else{
			theSlide++;
		}
		blendimage(theSlide);
	}
}

function startfade(){
	// make sure function doesn't fun twice
	if (faderunning != 0){
		return;
	}
	theSlide=slides.length-1;
	faderunning++;
	setTimeout("fade()",faderdelay);
	for(var j=0;j<slides.length;j++){
		preLoadImage("images/branding/"+slides[j][0]);
	}
}

function blendimage(theIndex) {
	blendDone=false;
    var speed = 10;
    var timer = 0;
    
    //set the current image as background
    document.getElementById('bg_image').src = document.getElementById('blendimage').src;
    document.getElementById('bg_image').alt = document.getElementById('blendimage').alt;
    //make image transparent
    changeOpac(0, 'blendimage');
    changeOpac(100, 'bg_image');
   
    //make new image
    document.getElementById('blendimage').src = "../../includes/site_images/branding/"+slides[theIndex][0];
    document.getElementById('blendimage').alt = slides[theIndex][1];
    //fade in image
    for(var t = 0; t <= 100; t++) {
        setTimeout("changeOpac(" + t + ",'blendimage')",(timer * speed));
        setTimeout("changeOpac(" + (100-t) + ",'bg_image')",(timer * speed));
        timer++;
        if(t==100){
	        blendDone=true;
        }
    }
}
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
	opacity = (opacity == 100)?99.999:opacity;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}

var fadeStr = '<div style="position:relative;width:'+imgWidth+'px; height:'+imgHeight+'px;">'
			+ '<div style="position:absolute; left:0px; top:0px; z-index:2;width:'+imgWidth+'px; height:'+imgHeight+'px;"><img src="../../includes/site_images/branding/'+slides[theSlide][0]+'" alt="'+slides[theSlide][1]+'" width="'+imgWidth+'" height="'+imgHeight+'" border="0" id="blendimage" style="filter: alpha(opacity=100); -moz-opacity: 100; opacity: 100;"></div>'
			+ '<div style="position:absolute; left:0px; top:0px; z-index:1;width:'+imgWidth+'px; height:'+imgHeight+'px;"><img src="../../includes/site_images/branding/'+slides[theSlide][0]+'" alt="'+slides[theSlide][1]+'" width="'+imgWidth+'" height="'+imgHeight+'" border="0" id="bg_image" style="filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0;"></div>'
			+ '</div>';

var fadeElement = document.createElement('banner_image_inner');
fadeElement.innerHTML = fadeStr;
document.getElementById("banner_image").appendChild(fadeElement);

addLoadEvent(startfade);